.clearfix::after {
  content: " ";
  display: block !important;
  clear: both;
}

.align-center {
  text-align: center;
}

.sec1 p {
  font-size: .65rem;
  font-weight: bold;
  line-height: 1.3rem;
  text-align: center;
}

.sec1 p span {
  color: #ff5800;
}

.sec1 p.big {
  font-size: 1.05rem;
  margin-bottom: .6rem;
  margin-top: .6rem;
  color: #ff0000;
}

.sec1 img {
  width: 15rem;
  padding: .3rem .5rem;
  background-color: #d8d6d9;
}

.sec2 {
  margin: .5rem;
}

.sec2 p.title {
  font-size: .75rem;
  font-weight: bold;
  margin-bottom: .25rem;
}

.sec2 p.intro {
  font-size: .6rem;
}

.sec2 .case img {
  width: 7rem;
  margin-bottom: .2rem;
  margin-top: .6rem;
}

.sec2 .case p.case-title {
  font-size: .65rem;
  font-weight: bold;
  margin-bottom: .1rem;
}

.sec2 .case p.project {
  font-size: .55rem;
}

.sec2 .case p.project span {
  color: #ff5800;
}

.sec2 .case .quest {
  margin-top: .4rem;
}

.sec2 .case .quest a {
  display: block;
  font-size: .55rem;
  transform: all;
  transition: all .5s;
  -webkit-transition: all .5s;
}

.sec2 .case .quest a:first-of-type {
  width: 3.275rem;
  height: .875rem;
  line-height: .875rem;
  color: #fff;
  background-color: #ff5800;
}

.sec2 .case .quest a:last-of-type {
  border: .025rem solid #000;
  width: 3.225rem;
  height: .825rem;
}

.sec2 .case .quest a:last-of-type:hover {
  border-color: #ff5800;
  background-color: #ff5800;
  color: #fff;
}

.sec2 a.chat {
  display: block;
  width: 11.725rem;
  height: 1.45rem;
  font-size: .6rem;
  color: #fff;
  line-height: 1.45rem;
  background-color: #a86342;
  border-radius: 0.725rem;
  margin: 1rem auto 0;
}

.sec3 {
  margin: 1.3rem .5rem 0;
}

.sec3 img.start {
  margin-bottom: 1rem;
}

.sec3 .flex {
  border: .025rem solid #a86342;
  margin-bottom: .5rem;
}

.sec3 .flex .word.f {
  margin-left: .8rem;
}

.sec3 .flex .word.s {
  margin-right: .8rem;
}

.sec3 .flex .word p.title {
  display: inline-block;
  font-size: .6rem;
  color: #a86342;
  padding: 0 .1rem .3rem;
  margin-bottom: .4rem;
  margin-top: .4rem;
  border-bottom: .025rem solid #a86342;
}

.sec3 .flex .word p.intro {
  line-height: .85rem;
  font-size: .55rem;
}

.sec3 .flex img {
  width: 6.425rem;
}

.sec4 {
  text-align: center;
  margin: .5rem;
}

.sec4 p.title {
  font-size: .75rem;
  margin-bottom: .35rem;
  margin-top: .75rem;
}

.sec4 p.intro {
  font-size: .6rem;
  margin-bottom: .65rem;
}

.sec4 ul li {
  font-size: .55rem;
  height: 1.15rem;
  line-height: 1.15rem;
  border: .025rem solid #e38c61;
  margin-bottom: .275rem;
}

.sec4 ul li a {
  padding-left: .625rem;
}

.sec4 ul li a span {
  display: block;
}

.sec4 ul li a p {
  width: 4.45rem;
  background-color: #e38c61;
  color: #fff;
}

.sec4 a.chat {
  display: block;
  font-size: .55rem;
  width: 11.725rem;
  height: 1.45rem;
  color: #fff;
  line-height: 1.45rem;
  background-color: #e38c61;
  border-radius: 0.725rem;
  margin: 1rem auto 0;
}

.sec4 a.chat strong {
  font-size: .6rem;
  color: #ff0000;
}

.sec4 a.chat img {
  width: .725rem;
  vertical-align: text-bottom;
}
